@model WalkingTec.Mvvm.Doc.ViewModels.MajorVms.MajorVm

<wt:fieldset field-set-style="Simple" title="Selector">
 </wt:fieldset>
   <p>Selector用于处理那些需要另外弹出页面进行搜索才能选定数据的场景，常用属性有：</p>
        <table lay-filter="parse-table-demo">
            <thead>
                <tr>
                    <th lay-data="{field:'username', width:200}">属性</th>
                    <th lay-data="{field:'joinTime', width:600}">描述</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Id</td>
                    <td>控件Id，默认根据绑定字段名称生成</td>
                </tr>
                <tr>
                    <td>Field</td>
                    <td>绑定字段，必填</td>
                </tr>
                <tr>
                    <td>Disabled</td>
                    <td>是否禁用</td>
                </tr>
                <tr>
                    <td>Name</td>
                    <td>控件Name，默认根据绑定字段名称生成</td>
                </tr>
                <tr>
                    <td>LabelText</td>
                    <td>标签内容</td>
                </tr>
                <tr>
                    <td>LabelWidth</td>
                    <td>标签的长度，默认为80</td>
                </tr>
                <tr>
                    <td>HideLabel</td>
                    <td>是否隐藏标签</td>
                </tr>
                <tr>
                    <td>EmptyText</td>
                    <td>无数据时显示的提示文本</td>
                </tr>
                <tr>
                    <td>SelectButtonText</td>
                    <td>选择按钮文本，默认为”选择“</td>
                </tr>
                <tr>
                    <td>WindowTitle</td>
                    <td>选择窗口的标题</td>
                </tr>
                <tr>
                    <td>Display</td>
                    <td>是否为显示模式，显示模式不能操作，只显示已选择的数据，默认为false</td>
                </tr>
                <tr>
                    <td>MultiSelect</td>
                    <td>是否开启多选，如果绑定的是Array或者List，则自动开启多选</td>
                </tr>
                <tr>
                    <td>WindowWidth</td>
                    <td>弹出窗口宽度</td>
                </tr>
                <tr>
                    <td>WindowHeight</td>
                    <td>弹出窗口高度</td>
                </tr>
                <tr>
                    <td>ListVM</td>
                    <td>弹出窗口关联的ListVM</td>
                </tr>
                <tr>
                    <td>TextBind</td>
                    <td>选择数据后，用于显示文本的字段</td>
                </tr>
                <tr>
                    <td>ValBind</td>
                    <td>选择数据后，用于传值的字段</td>
                </tr>
                <tr>
                    <td>SubmitFunc</td>
                    <td>确认选择数据后触发的js</td>
                </tr>
            </tbody>
        </table>
    <wt:quote>
        <p>Selector除了需要绑定Field之外，还需要绑定一个ListVM，用于在弹出窗口展示列表数据。可以在本身的VM上加入一个ListVM的属性，并做好相应的初始化，让Selector绑定这个ListVM</p>
    </wt:quote>
        <wt:tab>
            <wt:tabheaders>
                <wt:tabheader title="效果" />
                <wt:tabheader title="代码" />
            </wt:tabheaders>
            <wt:tabcontents>
                <wt:tabcontent>
                    <wt:form vm="@Model" style="max-width:600px;">
                        <wt:textbox field="Entity.MajorName" />
                        <wt:selector field="Entity.Students"  list-vm="StudentList" text-bind="StudentList.EntityList[0].Name">
                        </wt:selector>
                        <wt:row align="AlignEnum.Right">
                            <wt:submitbutton disabled="true" />
                            <wt:closebutton disabled="true" />
                        </wt:row>
                    </wt:form>
                </wt:tabcontent>
                <wt:tabcontent>
                    <wt:code>
&ltwt:form vm="@Model" width="600"&gt
    &ltwt:textbox field="Entity.MajorName" /&gt
    &ltwt:selector field="Entity.Students"  list-vm="StudentList" text-bind="StudentList.EntityList[0].Name"&gt
    &lt/wt:selector&gt
    &ltwt:row align="AlignEnum.Right"&gt
        &ltwt:submitbutton disabled="true" /&gt
        &ltwt:closebutton disabled="true" /&gt
    &lt/wt:row&gt
&lt/wt:form&gt

                    </wt:code>
                </wt:tabcontent>
            </wt:tabcontents>
        </wt:tab>

<wt:fieldset field-set-style="Simple" title="搜索">
    <p>Selector弹出的列表中，也可以加入搜索条件，例如：</p>
    <wt:tab>
        <wt:tabheaders>
            <wt:tabheader title="效果" />
            <wt:tabheader title="代码" />
        </wt:tabheaders>
        <wt:tabcontents>
            <wt:tabcontent>
                <wt:form vm="@Model" style="max-width:600px;">
                    <wt:textbox field="Entity.MajorName" />
                    <wt:selector field="Entity.Students2" list-vm="StudentList" text-bind="StudentList.EntityList[0].Name" select-button-text="条件">
                        <wt:searchpanel vm="StudentList">
                            <wt:row items-per-row=" ItemsPerRowEnum.Two">
                                <wt:textbox field="StudentList.Searcher.LoginName" />
                                <wt:combobox field="StudentList.Searcher.Sex" empty-text="全部"/>
                            </wt:row>
                        </wt:searchpanel>

                    </wt:selector>
                    <wt:row align="AlignEnum.Right">
                        <wt:submitbutton disabled="true" />
                        <wt:closebutton disabled="true" />
                    </wt:row>
                </wt:form>
            </wt:tabcontent>
            <wt:tabcontent>
                <wt:code>
&ltwt:form vm="@Model" width="600"&gt
    &ltwt:textbox field="Entity.MajorName" /&gt
    &ltwt:selector field="Entity.Students2" list-vm="StudentList" text-bind="StudentList.EntityList[0].Name" select-button-text="条件"&gt
        &ltwt:searchpanel vm="StudentList"&gt
            &ltwt:row items-per-row=" ItemsPerRowEnum.Two"&gt
                &ltwt:textbox field="StudentList.Searcher.LoginName" /&gt
                &ltwt:combobox field="StudentList.Searcher.Sex" empty-text="全部" /&gt
            &lt/wt:row&gt
        &lt/wt:searchpanel&gt

    &lt/wt:selector&gt
    &ltwt:row align="AlignEnum.Right"&gt
        &ltwt:submitbutton disabled="true" /&gt
        &ltwt:closebutton disabled="true" /&gt
    &lt/wt:row&gt
&lt/wt:form&gt
                </wt:code>
            </wt:tabcontent>
        </wt:tabcontents>
    </wt:tab>

</wt:fieldset>

    <script>
    layui.use('code',function(){layui.code({ about: false })})
        layui.table.init('parse-table-demo', {
        limit: 100, page: false
        });
    </script>
<script>
  $("#@Model.ViewDivId").parent().css("height", "auto");
</script>
